<template>
  <div>
    <el-tabs v-model="activeName">
      <el-tab-pane label="基本设置" name="first" />
      <el-tab-pane label="高级设置" name="second" />
    </el-tabs>
    <el-form
      ref="form"
      style="font-weight: 700"
      :model="form"
      label-width="80px"
      :rules="rules"
    >
      <el-form-item
        label="APP名字"
        prop="in_name"
        v-show="activeName === 'first'"
      >
        <el-input v-model="form.in_name" style="width: 500px"></el-input>
      </el-form-item>
      <el-form-item
        label="推广链接"
        prop="in_link"
        v-show="activeName === 'first'"
      >
        <div style="display: flex">
          <el-input
            disabled
            value="https://kb.eideas.cn/a/"
            style="width: 260px"
          ></el-input
          >+
          <el-input v-model="form.in_link" style="width: 233px"></el-input>
        </div>
      </el-form-item>
      <el-form-item label="下载密码" v-show="activeName === 'second'">
        <el-input
          v-model="form.in_apppwd"
          style="width: 500px"
          placeholder="请输入下载密码"
        ></el-input>
      </el-form-item>
      <el-form-item
        label="联系方式"
        style="width: 581px"
        v-show="activeName === 'second'"
      >
        <el-input
          v-model="form.in_contact"
          placeholder="请输入微信/QQ/手机号(格式:微信 123456696)"
        ></el-input>
      </el-form-item>
      <el-form-item
        label="下载限制"
        style="width: 581px"
        v-show="activeName === 'second'"
      >
        <el-input
          v-model="form.in_applimit"
          placeholder="请输入限制下载次数，不埴表示不限制"
        ></el-input>
      </el-form-item>
      <el-form-item
        label="应用介绍"
        style="width: 581px"
        v-show="activeName === 'second'"
      >
        <el-input
          type="textarea"
          v-model="form.in_appintro"
          placeholder="请输入应用介绍"
        ></el-input>
      </el-form-item>
      <el-form-item
        label="备注"
        style="width: 581px"
        v-show="activeName === 'second'"
      >
        <el-input
          type="textarea"
          v-model="form.in_remark"
          placeholder="请输入备注"
        ></el-input>
      </el-form-item>
      <el-form-item
        label="语言"
        style="width: 581px"
        v-show="activeName === 'second'"
      >
        <el-select v-model="form.template_language">
          <el-option label="中文" value="zh"></el-option>
          <el-option label="英文" value="en"></el-option>
          <el-option label="中文繁体" value="zh-tw"></el-option>
        </el-select>
      </el-form-item>
      <el-form-item>
        <el-button type="primary" @click="onSubmit">保存</el-button>
      </el-form-item>
    </el-form>
  </div>
</template>

<script>
import { appEdit } from '@/api/App';

export default {
  props: ['list'],
  data() {
    return {
      activeName: 'first',
      form: {}, //数据
      rules: {
        in_name: [
          { required: true, message: '请输入APP名字', trigger: 'blur' },
          { min: 2, max: 20, message: '长度在 3 到 20 个字符', trigger: 'blur' }
        ],
        in_link: [
          {
            required: true,
            message: '请输入链接',
            trigger: 'blur'
          },
          {
            min: 2,
            max: 15,
            message: '长度在 2到 15 个字符',
            trigger: 'blur'
          },
          {
            pattern: /^[0-9a-zA-Z]+$/,
            message: '只能输入数字或英文大小写字符',
            trigger: 'blur'
          }
        ]
      }
    };
  },
  created() {
    this.form = JSON.parse(JSON.stringify(this.list));
  },
  watch: {
    list: {
      handler() {
        this.form = JSON.parse(JSON.stringify(this.list));
      },
      deep: true
    },
    form: {
      handler(val) {
        console.log(val);
      },
      deep: true
    }
  },
  methods: {
    //保存
    onSubmit() {
      //删除多余
      delete this.form.in_uid;
      delete this.form.in_uname;
      delete this.form.in_icon;
      delete this.form.in_form;
      delete this.form.in_bid;
      delete this.form.in_mnvs;
      delete this.form.in_bsvs;
      delete this.form.in_bvs;
      delete this.form.in_type;
      delete this.form.in_nick;
      delete this.form.in_team;
      delete this.form.in_udids;
      delete this.form.in_app;
      delete this.form.in_originalName;
      delete this.form.in_downloads;
      delete this.form.in_deduct;
      delete this.form.in_size;
      delete this.form.in_tutorial;
      delete this.form.in_appstore;
      delete this.form.in_kid;
      delete this.form.in_sign;
      delete this.form.in_resign;
      delete this.form.in_package;
      delete this.form.in_cert_type;
      delete this.form.in_applock;
      delete this.form.in_addtime;
      delete this.form.in_updatetime;
      delete this.form.remote;
      delete this.form.in_bexe;
      delete this.form.in_super;
      delete this.form.in_super_device_num;
      delete this.form.in_super_num;
      delete this.form.in_private;
      delete this.form.in_use_auth_code;
      delete this.form.auth_code_dispense_url;
      delete this.form.clear_time;
      delete this.form.in_steal_on;
      delete this.form.in_sign_type;
      this.$refs.form.validate(async (valid) => {
        if (valid) {
          await appEdit({
            ...this.form
          });
          this.$message.success('保存成功');
          window.location.reload();
        } else {
          this.$message.info('保存失败');
        }
      });
    }
  }
};
</script>

<style scoped>
.DownloadTemplate {
  border: 1px solid #eee;
  margin-right: 20px;
}
</style>
